// 引入vue
import Vue from 'vue'
// 该文件用于创建vuex中最为核心的store
// 通过终端下载 npm i vuex
// 引入vuex  
import Vuex from 'vuex'

// import category from './modules/category'
// 使用插件  Vuex是vue的插件
Vue.use(Vuex) 

// 模块化处理
const CountOption = {
    namespaced: true,  //开启命名空间 方便mapState找到对应state
    actions:{
        // 会接收到两个参数，一个是context上下文（迷你版的store），一个是组件传过来的值value
        jiaodd(context,value){
            if(context.state.sum % 2 )
                context.commit('JIA',value)
        },
        jiawait(context,value){
            setTimeout(()=>{
                context.commit('JIA',value)
            },300)
        }
    },
    mutations:{
         // 接收到两个参数，一个是数据存储对象state，一个是组件传过来的值
        JIA(state,value){
            console.log("调用了mutations中的JIA函数")
            state.sum += value
        },
        JIAN(state,value){
            console.log("调用了mutations中的JIAN函数")
            state.sum -= value
        },
    },
    state:{
        sum:0,
        name:'菜菜',
        school:'尚硅谷',
    },
    getters:{
        // 类似vue中computed
        bigsum(state){
            return state.sum *10
        }
    }
}

const PersonOption = {
    namespaced: true,
    // actions,
    mutations:{
        ADD_PER(state,value){
            state.personlist.unshift(value)
        }
    },
    state:{
        personlist:[{id:'001',name:'菜菜'}]
    },
    // getters
}

// 默认暴露 创new一个store
export default new Vuex.Store({
    countAbout:CountOption,
    personAbout:PersonOption,
    // category
    // 对象的名和值相同可以简写
})